
<%@ include file="../common/top.jsp" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<div id="Catalog" >
    <form  class="user-form"  name="a" id="form">
            <div class="user-form-error">
                <p class="error-msg"  ><font color="red" id="error-msg"></font></p>
            </div>

        <div class="user-form-wrap">
                <div class="user-form-item">
                    <label for="username" class="user-form-label">
                        <i class="fa-solid fa-user"></i>
                    </label>
                    username
                    <input type="text" class="user-form-input" name="username" id="username" autocapitalize="off" >
                </div>
                <div class="user-form-item">
                    <label for="password" class="user-form-label">
                        <i class="fa-solid fa-lock"></i>
                    </label>
                    password
                    <input type="password" class="user-form-input" name="password" id="password"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="repeatPassword" class="user-form-label">
                        <i class="fa-solid fa-lock"></i>
                    </label>
                    repeatPassword
                    <input type="password" class="user-form-input" name="repeatPassword" id="repeatPassword"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="firstname" class="user-form-label">
                        <i class="fa-solid fa-signature"></i>
                    </label>
                    firstname
                    <input type="text" class="user-form-input" name="firstname" id="firstname"  autocapitalize="off">
                </div>
                <div class="user-form-item" >
                    <label for="lastname" class="user-form-label">
                        <i class="fa-solid fa-signature"></i>
                    </label>
                    lastname
                    <input type="text" class="user-form-input" name="lastname" id="lastname"  autocapitalize="off">
                </div>

                <div class="user-form-item">
                    <label for="email" class="user-form-label">
                        <i class="fa-solid fa-envelope"></i>
                    </label>
                    email
                    <input type="text" class="user-form-input" name="email" id="email"  autocapitalize="off">
                </div>
            <div class="user-form-item">
                <label for="token" class="user-form-label">
                    <i class="fa-solid fa-envelope"></i>
                </label>
                token
                <input type="text" class="user-form-input" name="token" id="token" autocapitalize="off">
            </div>

            <div class="user-form-item">
                <input type="submit" name="getCode" id="getCode" value="Get a verification code" style="width: 150px">
            </div>
        </div>
        <div class="user-form-wrap">
                <div class="user-form-item">
                    <label for="country" class="user-form-label">
                        <i class="fa-solid fa-globe"></i>
                    </label>
                    country
                    <input type="text" class="user-form-input" name="country" id="country"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="state" class="user-form-label">
                        <i class="fa-solid fa-address-card"></i>
                    </label>
                    state
                    <input type="text" class="user-form-input" name="state" id="state"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="city" class="user-form-label">
                        <i class="fa-solid fa-city"></i>
                    </label>
                    city
                    <input type="text" class="user-form-input" name="city" id="city"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="address1" class="user-form-label">
                        <i class="fa-solid fa-location-dot"></i>
                    </label>
                    address1
                    <input type="text" class="user-form-input" name="address1" id="address1"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="address2" class="user-form-label">
                        <i class="fa-solid fa-location-dot"></i>
                    </label>
                    address2
                    <input type="text" class="user-form-input" name="address2" id="address2"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="zip" class="user-form-label">
                        <i class="fa-brands fa-codepen"></i>
                    </label>
                    zip
                    <input type="text" class="user-form-input" name="zip" id="zip"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="phone" class="user-form-label">
                        <i class="fa-solid fa-phone"></i>
                    </label>
                    phone
                    <input type="text" class="user-form-input" name="phone" id="phone"  autocapitalize="off">
                </div>
                <div class="user-form-item">
                    <label for="favcategory" class="user-form-label">
                        <i class="fa-solid fa-cat"></i>
                    </label>
                    <select class="combo" id="favcategory" style="width: auto" name="favcategory">
                        <option value="not" ></option>
                        <option value="CATS">CATS</option>
                        <option value="DOGS">DOGS</option>
                        <option value="FISH">FISH</option>
                        <option value="REPTILES">REPTILES</option>
                        <option value="BIRDS">BIRDS</option>
                    </select>
                </div>
        </div>
        <div class="user-form-item">
            <input type="submit" value="registerOnly" class="user-form-submit" name="registerOnly" id="registerOnly" >
            <input type="submit" value="registerAndLogin" class="user-form-submit" name="registerAndLogin" id="registerAndLogin" >
        </div>
    </form>
    Want to sign in?
    <a href="signonForm">Sign in!</a>
</div>
<%@ include file="../common/bottom.jsp" %>
<script>
    function sendCode(){
        document.a.action="verification";
        document.a.method="post";
        document.a.submit();
        // document.regi
    }
    function send(){
        document.a.method="post";
        document.a.action="register";
        document.a.submit();
        // document
    }
</script>
<script src="js/register.js"></script>